﻿@page
@using Volo.Abp.AspNetCore.Mvc.UI.Packages.TuiEditor
@using Volo.Blogging.Posts
@using Microsoft.AspNetCore.Mvc.Localization
@using Volo.Blogging.Localization
@using Volo.Blogging.Pages.Blogs.Posts
@inject IHtmlLocalizer<BloggingResource> L
@model Volo.Blogging.Pages.Blogs.Posts.EditModel
@{
    ViewBag.PageTitle = "Edit Blog Post";
}
@section styles {
    <abp-style-bundle name="@typeof(EditModel).FullName">
        <abp-style type="@typeof(TuiEditorStyleContributor)" />
        <abp-style src="/Pages/Blogs/Posts/new.css" />
    </abp-style-bundle>
}
@section scripts {
    <abp-script-bundle name="@typeof(EditModel).FullName">
        <abp-script src="/client-proxies/blogging-proxy.js" />
        <abp-script type="@typeof(TuiEditorScriptContributor)"/>
        <abp-script src="/Pages/Blogs/Posts/edit.js"/>
    </abp-script-bundle>
}
<div id="edit-post-container">
    <div class="container py-5">
        <div class="row">
            <div class="col-12 col-md-8 col-lg-7 mx-auto">
                <div class="card">
                    <div class="card-body">
                        <form method="post" id="edit-post-form">

                            <abp-input asp-for="Post.ConcurrencyStamp" />

                            <abp-input asp-for="Post.Title" auto-focus="true" />

                            <abp-alert
                                dismissible="true"
                                style="display: none"
                                id="title-length-warning"
                                data-max-length="@PostConsts.MaxTitleLengthToBeSeoFriendly">
                                @L["TitleLengthWarning"]
                            </abp-alert>

                            <abp-input asp-for="Post.Url" />
                            <abp-input asp-for="Post.CoverImage" />

                            <abp-row>
                                <abp-column size-sm="_9">
                                    <div class="mb-3">
                                        <label class="form-label" for="CoverImageFile">@L["CoverImage"]</label>
                                        <span> * </span>
                                        <input class="form-control" type="file" id="CoverImageFile" />
                                    </div>
                                </abp-column>
                                <abp-column size-sm="_3">
                                    <img id="CoverImage" src="@Model.Post.CoverImage" height="80" width="160" />
                                </abp-column>
                            </abp-row>


                            <abp-input asp-for="Post.Tags" />
                            <abp-input asp-for="Post.Description" info="@L["PostDescriptionHint"].Value" />
                            <abp-input asp-for="Post.BlogId" />
                            <abp-input asp-for="Post.Id" />
                            <abp-input asp-for="Post.Content" />

                            <div class="mb-3">
                                <div class="edit-post-editor">
                                    <div class="gradient-background-animation loading-cover"></div>
                                </div>
                            </div>

                            <div class="actions d-flex">
                                <div class="text-muted editor-info d-none d-lg-block me-auto">

                                    <div>
                                        <svg class="markdown-icon" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true">
                                            <path fill-rule="evenodd" d="M14.85 3H1.15C.52 3 0 3.52 0 4.15v7.69C0 12.48.52 13 1.15 13h13.69c.64 0 1.15-.52 1.15-1.15v-7.7C16 3.52 15.48 3 14.85 3zM9 11H7V8L5.5 9.92 4 8v3H2V5h2l1.5 2L7 5h2v6zm2.99.5L9.5 8H11V5h2v3h1.5l-2.51 3.5z"></path>
                                        </svg> <small>@L["MarkdownSupported"] </small>
                                    </div>

                                    <div><small><i class="fa fa-copy"></i> @L["FileUploadInfo"].Value</small></div>

                                </div>
                                <div class="mt-3 d-flex flex-row-reverse">
                                    <abp-button id="PostFormSubmitButton" button-type="Primary" type="submit" form="edit-post-form" text="@L["Submit"].Value" icon="check" />

                                    <a asp-page="/Blog/Posts/Detail" asp-route-postUrl="@Model.Post.Url" asp-route-blogShortName="@Model.BlogShortName" class="btn btn-default me-2"><span>@L["Cancel"]</span></a>
                                </div>
                            </div>
                        </form>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
